<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .echart{
            width: 500px;
            height: 500px;
        }
    </style>
</head>
<body>
中国地图
<div class="echart" id="worldMap"></div>
<script src="../jquery.min.js" charset="utf-8"></script>
<script src="../echarts.js"></script>
<script src="china.js"></script>
<script>
  //初始化echarts
  var myChartMap;
  worldMap(); //世界地图
  function worldMap() {
    // myChart.showLoading({
    //   text: 'loading',
    //   color: '#c23531',
    //   textColor: '#000',
    //   maskColor: 'rgba(255, 255, 255, 0.2)',
    //   zlevel: 0,
    // });
    // myChart.hideLoading();
    /*标准必要专利数量排行-echart*/
    var echartNameDataArr = []; //X轴企业名称
    var echartNumDataArr = []; //Y轴标准数量
    // ajaxListByPatent().then(function (declEntityList) {
    //   var i = 0;
    //   repeat();
    //   function repeat() {
    //     if (i < declEntityList.length) {
    //       //企业没名字的移除
    //       ajaxcountByDeclEntity(declEntityList[i].name).then(function (declEntityNum) {
    //         echartNameDataArr.push(declEntityList[i].name);
    //         echartNumDataArr.push(declEntityNum);
    //         i++;
    //         repeat();
    //       });
    //     } else {
    //       console.log('Standard', echartNameDataArr, echartNumDataArr);
    //       echartSetOption();//构建标准分布 echarts
    //     }
    //   }
    echartSetOption();//构建标准分布 echarts
    //标准必要专利数量排行 echarts
    function echartSetOption() {
      // 基于准备好的dom，初始化echarts实例
      var myChart = echarts.init(document.getElementById('worldMap'));
      var mapDataList = [{
        name: "南海诸岛",
        value: 0
      },
        {
          name: '北京',
          value: 54
        }
      ];
      var visualMapParams = {
        min:mapDataList[0].value,
        max: mapDataList.slice(-1)[0].value,
      }
      var option = {
        tooltip: {
          show: true,
          // triggerOn: "click",
          // formatter: function(e, t, n) {
          //   return .5 == e.value ? e.name + "：有疑似病例" : e.seriesName + "<br />" + e.name + "：" + e.value
          // }
        },
        //工具：数据、下载、还原
        toolbox: {
          show: true,
          orient: 'vertical',
          // left: '',
          right:'20px',
          top: 'center',
          feature: {
            dataView: {
              readOnly: false
            },
            restore: {},
            saveAsImage: {}
          }
        },
        visualMap: {
          min: 0,
          max: 1000,
          left: 26,
          bottom: 40,
          showLabel: !0,
          text: ["高", "低"],
          calculable: true,//可筛选
          // pieces: [{
          //   gt: 100,
          //   label: "> 100 人",
          //   color: "#7f1100"
          // }, {
          //   gte: 10,
          //   lte: 100,
          //   label: "10 - 100 人",
          //   color: "#ff5428"
          // }, {
          //   gte: 1,
          //   lt: 10,
          //   label: "1 - 9 人",
          //   color: "#ff8c71"
          // }, {
          //   gt: 0,
          //   lt: 1,
          //   label: "疑似",
          //   color: "#ffd768"
          // }, {
          //   value: 0,
          //   color: "#ffffff"
          // }],
          show: !0
        },
        geo: {
          map: "china",
          center: [104.114129, 37.550339],//当前视角的中心点
          zoom: 1, //当前视角的缩放比例
          roam: true, //是否开启平游或缩放
          scaleLimit: { //滚轮缩放的极限控制
            min: 1,
            max: 2
          },
          // top: 80,
          label: {
            normal: {
              show: !0,
              fontSize: "14",
              color: "rgba(0,0,0,0.7)"
            }
          },
          itemStyle: {
            normal: {
              //shadowBlur: 50,
              //shadowColor: 'rgba(0, 0, 0, 0.2)',
              borderColor: "rgba(0, 0, 0, 0.2)"
            },
            emphasis: {
              areaColor: "#f2d5ad",
              shadowOffsetX: 0,
              shadowOffsetY: 0,
              borderWidth: 0
            }
          }
        },
        series: [{
          name: "确诊病例",
          type: "map",
          geoIndex: 0,
          data: mapDataList
        }]
      };
      // 使用刚指定的配置项和数据显示图表。
      myChart.setOption(option);
      //监听自适应大小
      window.addEventListener("resize", () => {
        myChart.resize();
      });
    }
  };
</script>
</body>
</html>